<div class="system-publish-container w100 h100">
  <div class="content-box" *ngIf="!isView">
    <div class="tab-list flex flex-justify-start flex-align-center">
      <div [ngClass]="['list-item', searchParams.publishState === item.value ? 'active' : '']"
           (click)="changeTab(item)"
           *ngFor="let item of tabList;"
      >
        {{item.text}}
      </div>
    </div>
    <div class="table-top-search">
      <div class="top-search-left">
        <label>
          <button nz-button nzType="primary" (click)="clickAdd()">
            <i nz-icon nzType="plus" nzTheme="outline"></i>新增
          </button>
        </label>
        <label>
          <button
            nz-button nzType="default"
            nz-popconfirm
            nzOkType="danger"
            nzTitle="确定删除所选数据吗?"
            (nzOnCancel)="cancelFn()"
            (nzOnConfirm)="deleteAll()"
            nzPlacement="top"
            [disabled]="canDelete"
          >
            <i nz-icon nzType="delete" nzTheme="outline"></i>批量删除
          </button>
        </label>
      </div>
      <div class="top-search-right">
        <label>
          文件号：
          <input type="text" nz-input placeholder="请输入" [(ngModel)]="searchParams.number">
        </label>
        <label>
          制度名称：
          <input type="text" nz-input placeholder="请输入" [(ngModel)]="searchParams.name">
        </label>
        <label>
          作用对象：
          <nz-select nzAllowClear [(ngModel)]="searchParams.actionTarget">
            <nz-option *ngFor="let item of targetList;" [nzLabel]="item.text" [nzValue]="item.value"></nz-option>
          </nz-select>
        </label>
        <label>
          发布部门：
          <input type="text" nz-input placeholder="请输入" [(ngModel)]="searchParams.publishDeptName">
        </label>
        <div class="table-top-btn">
          <button nz-button nzType="primary" (click)="clickSearch()">查询</button>
          <button nz-button nzType="default" (click)="resetSearch()">重置</button>
        </div>
      </div>
    </div>
    <div class="table-box">
        <ng-template #totalTemplate let-total>总共 {{ pageInfo.totalRecords ? pageInfo.totalRecords : 0 }} 条</ng-template>
        <nz-table
          nzBordered
          [nzData]="dataList"
          [nzFrontPagination]="false"
          [nzShowPagination]="true"
          [nzPageIndex]="pageInfo.first"
          [nzTotal]="pageInfo.totalRecords"
          [nzShowTotal]="totalTemplate"
          [nzPageSize]="pageInfo.rows"
          [nzLoadingDelay]="1"
          [nzPageSizeOptions]="[10,20,30,50,100]"
          [nzShowQuickJumper]="true"
          [nzShowSizeChanger]="true"
          (nzPageIndexChange)="searchPageIndex($event)"
          (nzPageSizeChange)="searchPageSize($event)"
          [nzWidthConfig]="widthConfigs"
          [nzScroll]="{x: '2190px'}"
        >
          <thead>
            <tr>
              <th class="tableCheck"
                  nzShowCheckbox
                  [(nzChecked)]="isAllCheck"
                  [nzIndeterminate]="isIndeterminate"
                  (nzCheckedChange)="checkAll($event)"
                  nzLeft="0px"
              ></th>
              <th>序号</th>
              <th>文件号</th>
              <th>制度名称</th>
              <th>制度类型</th>
              <th>执行部门</th>
              <th>作用对象</th>
              <th>制度状态</th>
              <th>制度生效日期</th>
              <th>查看有效日期</th>
              <th>其他部门操作权限</th>
              <th>发布人</th>
              <th>发布部门</th>
              <th>发布日期</th>
              <th>发布状态</th>
              <th>驳回理由</th>
              <th nzRight="0px" style="width:220px;">操作</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let item of dataList; let i = index">
              <td
                nzShowCheckbox
                [(nzChecked)]="mapOfCheckedId[item.id]"
                (nzCheckedChange)="refreshStatus()"
                nzLeft="0px"
              ></td>
              <td>{{i + 1}}</td>
              <td>{{item.number}}</td>
              <td>{{item.name}}</td>
              <td>{{item.caseType}}</td>
              <td>{{item.deptNameStr}}</td>
              <td>{{item.actionTarget}}</td>
              <td>{{stateObj[item.state]}}</td>
              <td>{{item.effectiveDate | date: 'yyyy-MM-dd'}}</td>
              <td>
                <span *ngIf="item.noLimitViewDate">不限</span>
                <span *ngIf="!item.noLimitViewDate">
                  {{
                  item.viewStartDate | date: 'yyyy-MM-dd'}}至{{item.viewEndDate | date: 'yyyy-MM-dd'
                  }}
                </span>
              </td>
              <td>{{item.otherDeptAuth}}</td>
              <td>{{item.publisherName}}</td>
              <td>{{item.publishDeptName}}</td>
              <td>{{item.publishDate}}</td>
              <td>{{publishState[item.publishState]}}</td>
              <td>{{item.content}}</td>
              <td nzRight="0px">
                <span class="operaFont firOpera" (click)="clickEdit(item.id)">编辑</span>
                <span class="operaFont operaTao"
                      nz-popconfirm
                      nzOkType="danger"
                      nzTitle="确定删除该制度吗?"
                      (nzOnConfirm)="deleteOne(item.id)"
                      nzPlacement="top"
                >删除</span>
              </td>
            </tr>
          </tbody>
        </nz-table>
      </div>
  </div>
  <div class="view-modal-box" *ngIf="isView">
    <div class="operate-box">
      <div class="title flex flex-space-between">
        {{formObj.id ? '编辑' : '新增'}}制度
        <div class="back-info operaFont" (click)="isView = false">
          返回上一级<i class="fa fa-reply m-l-sm"></i>
        </div>
      </div>
      <div class="content">
        <form nz-form [formGroup]="validateForm">
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              文件号
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <input type="text" nz-input placeholder="请输入" [(ngModel)]="formObj.number" formControlName="number">
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              制度名称
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <input type="text" nz-input placeholder="请输入" [(ngModel)]="formObj.name" formControlName="name">
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              制度类型
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <div class="control-box flex flex-space-between flex-align-center">
                <nz-select [(ngModel)]="formObj.caseType" nzAllowClear nzShowSearch formControlName="caseType" nzPlaceHolder="请按功能选择">
                  <nz-option *ngFor="let item of caseTypeList" [nzValue]="item.keyCode" [nzLabel]="item.keyCode"></nz-option>
                </nz-select>
                <nz-select [(ngModel)]="formObj.deptType" nzAllowClear nzShowSearch formControlName="deptType" nzPlaceHolder="请按部门选择">
                  <nz-option *ngFor="let item of deptTypeList" [nzValue]="item.keyCode" [nzLabel]="item.keyCode"></nz-option>
                </nz-select>
              </div>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              执行部门
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <nz-tree-select
                [(ngModel)]="formObj.deptList" class="w100"
                nzShowSearch
                nzAllowClear
                nzMultiple
                [nzNodes]="deptList"
                nzPlaceHolder="请选择"
                (ngModelChange)="changeDeptList($event)"
                formControlName="deptList">
              </nz-tree-select>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              作用对象
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <div class="target-box flex flex-justify-start flex-align-center">
                <nz-checkbox-group
                  [(ngModel)]="actionTargetList"
                  formControlName="actionTarget"
                  (ngModelChange)="changeActionTarget($event)"
                >
                </nz-checkbox-group>
                <nz-select *ngIf="formObj.actionTarget.includes('中干')" nzMode="multiple" nzShowSearch nzAllowClear nzPlaceHolder="请选择中干" [(ngModel)]="formObj.targetMajorList" formControlName="targetMajorList">
                  <nz-option *ngFor="let item of middleList" [nzLabel]="item.name + ' ' + item.number" [nzValue]="item.id"></nz-option>
                </nz-select>
                <nz-select *ngIf="formObj.actionTarget.includes('老师')" nzMode="multiple" nzShowSearch nzAllowClear nzPlaceHolder="请选择教师" [(ngModel)]="formObj.targetTeacherList" formControlName="targetTeacherList">
                  <nz-option *ngFor="let item of teacherList" [nzLabel]="item.name + ' ' + item.number" [nzValue]="item.id"></nz-option>
                </nz-select>
                <nz-select *ngIf="formObj.actionTarget.includes('学生')" nzMode="multiple" nzShowSearch nzAllowClear nzPlaceHolder="请选择班级" [(ngModel)]="formObj.targetStudentList" formControlName="targetStudentList">
                  <nz-option *ngFor="let item of classesList" [nzLabel]="item.name" [nzValue]="item.id"></nz-option>
                </nz-select>
              </div>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              制度状态
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <nz-select nzPlaceHolder="请选择" [(ngModel)]="formObj.state" formControlName="state">
                <nz-option *ngFor="let item of stateList" [nzValue]="item.value" [nzLabel]="item.label"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
          <div nz-row>
            <div nz-col nzSpan="12">
              <nz-form-item>
                <nz-form-label [nzSm]="8" nzRequired>
                  制度生效日期
                </nz-form-label>
                <nz-form-control [nzSm]="16">
                  <nz-date-picker [(ngModel)]="formObj.effectiveDate" formControlName="effectiveDate"></nz-date-picker>
                </nz-form-control>
              </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
              <nz-form-item>
                <nz-form-label [nzSm]="8" nzRequired>
                  查看有效日期
                </nz-form-label>
                <nz-form-control [nzSm]="16" class="date">
                  <nz-range-picker [nzDisabled]="formObj.noLimitViewDate" [(ngModel)]="formObj.viewDate" formControlName="viewDate"></nz-range-picker>
                  <label class="no-limit" nz-checkbox [(ngModel)]="formObj.noLimitViewDate" formControlName="noLimitViewDate">不限</label>
                </nz-form-control>
              </nz-form-item>
            </div>
          </div>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              其他部门操作权限
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <nz-checkbox-group
                [(ngModel)]="operateAuthList"
                formControlName="otherDeptAuth"
                (ngModelChange)="changeAuth($event)"
              >
              </nz-checkbox-group>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              附件
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <nz-upload [nzAction]="uploadUrl"
                         [nzHeaders]="headerInfo"
                         [nzData]="{'moduleName': 'institution'}"
                         [(nzFileList)]="fileList"
                         [nzRemove]="deleteFlile"
                         (nzChange)="handleChange($event)"
                         [nzAccept]="'.doc,.docx,.pdf'"
              >
                <button nz-button>
                  <i nz-icon type="upload"></i><span>点击上传</span>
                </button>
              </nz-upload>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="4" nzRequired>
              审批人
            </nz-form-label>
            <nz-form-control [nzSm]="20">
              <nz-select [(ngModel)]="formObj.checkerId" formControlName="checkerId">
                <nz-option *ngFor="let item of teacherList"
                           [nzValue]="item.id"
                           [nzLabel]="item.name + ' ' + item.number + ' ' + item.orgName"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </form>
        <div class="btn-box">
          <button nz-button nzType="default" (click)="isView = false;">取消</button>
          <button nz-button nzType="default" *ngIf="!formObj.id" (click)="stageInstitution()">暂存</button>
          <button nz-button nzType="primary" (click)="clickConfirm()">确定</button>
        </div>
      </div>
    </div>
  </div>
</div>
